﻿@using CQIE.TES.Model

@{
    ViewBag.Title = "Manager";
    Layout = "~/Views/Shared/Template.cshtml";
}

    <style>
        .content {
            width: 1210px;
            margin: 0 auto;
        }
    </style>
    <div class="content">
        <table id="mytable" lay-filter="mytable"></table>
    </div>
<script type="text/html" id="mybar">
    <a class="layui-btn layui-btn-xs layui-btn-danger {{ d.state=='已完成'?'layui-btn-disabled':'' }} {{ d.state=='进行中'?'layui-btn-disabled':'' }}" lay-event="start">立即开始</a>
    <a class="layui-btn layui-btn-warm layui-btn-xs {{ d.state=='已完成'?'layui-btn-disabled':'' }} {{ d.state=='未开始'?'layui-btn-disabled':'' }}" lay-event="stop">立即停止</a>
</script>

<script type="text/html" id="toolbar">
    <div class="layui-form" lay-filter="studyYear">
        <div class="layui-form-item">
            <label class="layui-form-label">学年</label>
            <div class="layui-input-block">
                <select name="studyYear" lay-filter="mySelect" lay-verify="" lay-search>
                    <option value="-1">全部</option>
                    @foreach (StudyYear item in ViewBag.StudyYears)
                    {
                        <option value="@item.ID">@item.Name</option>
                    }
                </select>
            </div>
        </div>
        
    </div>
</script>

<script>
    layui.use(['table','jquery','form'], function(){
        var table = layui.table;
        var $ = layui.jquery;
        var form = layui.form;

        //第一个实例
        var tableInfo = table.render({
            elem: '#mytable'
            , height: 600
            ,limit:12
            , url: '/api/eva/getall' //数据接口
            , page: true //开启分页
            , toolbar:"#toolbar"
            ,cols: [[ //表头
                { field: 'id', title: 'ID', hide:true },
                { type: "numbers", title: "序号", width: 28},
                { field: 'name', title: '标题', width: 104,align:'center'},
                { field: 'startTime', title: '开始时间', width: 94, align:'center' },
                { field: 'endTime', title: '结束时间', width: 104, align:'center '},
                { field: 'state', title: "状态", width: 80, align:'center'},
                { field: 'SHeight', title: '学生比重', templet: `<div>{{d.SHeight=='0%'?"未参与":d.SHeight}}</div>`, width: 86, align:'center' },
                { field: 'DHeight', title: '系部比重', templet: `<div>{{d.DHeight=='0%'?"未参与":d.DHeight}}</div>`, width: 86, align:'center'},
                { field: 'LHeight', title: '教研室比重', templet: `<div>{{d.LHeight=='0%'?"未参与":d.LHeight}}</div>`, width: 100, align:'center'},
                { field: 'THeight', title: '教师互评比重', templet: `<div>{{d.THeight=='0%'?"未参与":d.THeight}}</div>`, width:114, align:'center'},
                { field: 'MHeight', title: '自评比重', templet: `<div>{{d.MHeight=='0%'?"未参与":d.MHeight}}</div>`, width: 86, align:'center'},
                { field: 'studyYear', title: '学年', width: 104, align:'center '},
                { title: "操作", templet: "#mybar", width:215, align:'center'}
            ]]
        });

        // 监听下拉框
        form.on('select(mySelect)', function(data) {
            let studyYearId = data.value;
            tableInfo.reload(
                {
                    where: { studyYearId  }
                });
            form.val("studyYear",
                {
                    studyYear: studyYearId
                });
        });  

        // 监听行工具条
        table.on('tool(mytable)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）

            if (layEvent === 'start'){ //立即开始
                //do somehing
                if (data.state==="已完成"||data.state==="进行中") {
                    return;
                }
                layer.confirm('是否确定立即开始该评教？', function (index) {
//                    console.log(data.id);
                    //向服务端发送删除指令
                    $.post('/api/eva/startnow',
                        { eid: data.id },
                        function(res) {
                            layer.msg(res.msg);
                        });
                    layer.close(index);
                    table.reload();
                });

            }
            else if (layEvent === 'stop') { //立即停止
                if (data.state==="已完成"||data.state==="未开始") {
                    return;
                }
                //do something
                layer.confirm('是否确定立即停止该评教？', function (index) {
                    //console.log(data.id);
                    //向服务端发送删除指令
                    $.post('/api/eva/endnow',
                        { eid: data.id },
                        function (res) {
                            layer.msg(res.msg);
                        });
                    layer.close(index);
                    table.reload();
                });

            }
            else if (layEvent === 'noEva') {
                let id = data.id;

                // do something
                // 打开弹窗


            }
        });
    });
</script>
